<template>
	<div class="container">
		<el-breadcrumb separator-class="el-icon-arrow-right">
			<el-breadcrumb-item :to="{ path: '/' }"><b>首页</b></el-breadcrumb-item>
			<el-breadcrumb-item><b>评论管理</b></el-breadcrumb-item>
		</el-breadcrumb>

		<el-form :inline="true" :model="ff" class="demo-form-inline" style="margin-top: 15px;">
			<el-form-item label="分数">
				<el-input v-model="ff.score" placeholder="请输入分数"></el-input>
			</el-form-item>
			
			<el-form-item>

				
				<el-button type="primary" icon="el-icon-search" @click="handleList">查询</el-button>
				<!-- <el-button type="danger" icon="el-icon-delete" @click="plsc">批量删除</el-button> -->
				<el-button @click="deleteFileOrDirectory(sels)" :disabled="this.sels.length === 0"> 批量删除</el-button>
			<!-- 	<el-button type="success" icon="el-icon-plus" @click="handadd()">新增</el-button> -->
				<el-button :plain="true" type="info" icon="el-icon-help" @click="help()">帮助</el-button>
			</el-form-item>
			
		</el-form>



		<!-- 数据表格 -->
		<el-table :data="tableData" style="width: 100%;margin-top: -10px;" @selection-change="selsChange">
			<el-table-column type="selection" width="55">
			</el-table-column>
			<el-table-column label="#" type="index" width="60"></el-table-column>
			<el-table-column prop="score" label="分数" align="center">
			</el-table-column>
			
			<el-table-column prop="time" label="评论时间" :formatter="formatterDate" align="center">
			</el-table-column>
			
			<el-table-column prop="reply" label="商家回复" align="center">
			</el-table-column>
			
			<el-table-column prop="status" label="评价状态" :formatter="formattertype" align="center">
			</el-table-column>
			
			<el-table-column prop="replyTime" label="回复时间" :formatter="formatterDate" align="center">
			</el-table-column>
			
						
			<el-table-column label="操作" width="300px" align="center">
				<template slot-scope="scope">
					<el-button size="mini" type="infor" @click="handleEdit(scope.row)">回复</el-button>
					<el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
				</template>
			</el-table-column>
		</el-table>


		<!-- 分页栏 -->
		<el-pagination style="margin-top: 10px;" background @size-change="handleSizeChange" @current-change="handleCurrentChange"
		 :current-page="ff.page" :page-sizes="[10, 20, 30, 40]" :page-size="ff.rows" layout="total, sizes, prev, pager, next, jumper"
		 :total="ff.total">
		</el-pagination>

		
	</div>
</template>

<script>
	//时间格式化导包
		import {
			formatDate
		} from '../../assets/js/TimeFiter.js'
	export default {
		data() {
			return {
				dialogTitle: '评论管理',
				tableData: [],
				sels: [],
				dialogMergeForm: false,
				ff: {
					score: null,
					page: 1,
					rows: 5,
					total: -1
				},
				mergeForm: {
					score: null,
					reply: null,
				
					status: null,
		
					
				},
				rules: {
					// id: [],
					score: [{
						required: true,
						message: '请输入分数',
						trigger: 'blur'
					}]
					
				}
			}
		},
		created() {
			this.doList()
		},
		methods: {
			
			doList: function() {
				this.axios.post(this.axios.urls.SYS_SD_LIST, this.ff).then((response) => {
					console.log("这是数据：",response.data.result);
						this.tableData = response.data.result;
						this.ff.page = response.data.page
						this.ff.rows = response.data.rows
						this.ff.total = response.data.total
					
				});
			},
			formattertype: function(row, column) {
				return row.type == '1' ? '酒店' : row.type == '2' ? '房间' : '未知'
			},
			handleList: function() {
				this.doList()
			},
			selsChange(sels) {
				this.sels = sels
			},
			handleSizeChange(rows) {
				console.log('rows=%s', rows);
				this.ff.page = 1
				this.ff.rows = rows
				this.doList()
			},
			handleCurrentChange(page) {
				this.ff.page = page
				this.doList()
			},
			help() {
				this.$message('系统正在维护，请拨打10086阐述您的问题');
			},
			//时间格式化
						formatterDate: function(row, column) {
							let timea = row.time;
							let date = new Date(timea);
							return formatDate(date, 'yyyy-MM-dd');
						},
						
			handleDelete: function(index, row) {
				console.log('row.id',row.id)
				this.$confirm('您确定要删除此记录, 是否继续?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					this.axios.post(this.axios.urls.SYS_SD_SS, {
						'id': row.id
					}).then((response) => {
						this.$message({
							message: '删除成功',
							type: 'success'
						})
						this.doList()
					})
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消删除'
					})
				});
			
			},
			
			deleteFileOrDirectory() {
				var ids = this.sels.map(item => item.id).join() //获取所有选中行的id组成的字符串，以逗号分隔
				console.log('ids', ids)
				this.$confirm('您确定要删除此记录，是否继续?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					this.axios.post(this.axios.urls.SYS_SD_DEL, {
						'ids': ids
					}).then((response) => {
						this.$message({
							message: '删除成功',
							type: 'success'
						})
						this.doList()
					})
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消删除'
					})
				})
				},
			
			// },
			handleEdit: function(chc) {
				if (chc.status == 1) {
					this.$store.commit('setid', {
						id: chc,
					});
					this.$router.push('/ThotelAssessEdit');
				} else {
					this.$message({
						message: '商家已回复！！！',
						type: 'success'
					});
				}
			},
			// handadd: function() {
			// 	console.log('添加主题')
			// 	this.$router.push('/ThotelTopicAdd');
			// }

		}
	}
</script>

<style scoped="scoped">
	.container {
		margin: 15px;
	}

	.el-input__inner {
		width: 100px;
	}

	.el-input {
		width: 100px;
	}
</style>
